import * as YvanUI from "yvan-ui-wotu";
import * as Data from '../../data'
import {disease} from "../../data";

const React = YvanUI.React
const Button = YvanUI.Antd.Button
const List = YvanUI.Antd.List
const renderIcon = YvanUI.renderIcon
const _ = YvanUI.lodash
const Observer = YvanUI.Observer

interface Ref {
    theform: YvanUI.Form
    table1: YvanUI.Grid
    table2: YvanUI.Grid
}

export default class NodeGroup extends YvanUI.Scope<void, Ref> {

    query = this.$$({
        symptom: '',
        disease: ''
    })

    main = this.$$({
        gender: '2',
        version: Data.defaultVersion,
        guid: '',
        targetKeys: {
            symptom: [],
            disease: []
        }
    })

    onRender() {
        window['biz'] = this
    }

    addTarget(columnName: string, key: string) {
        if (!_.includes(this.main.targetKeys[columnName], key)) {
            this.main.targetKeys[columnName].push(key)
        }
    }

    buildTable(columnName, extend) {
        return _.extend({
            view: 'grid',
            showRowNumber: false,
            showHeader: false,
            pagination: true,
            paginationOption: {
                defaultPageSize: 10,
                size: "small",
                showSizeChanger: true,
                showTotal: (total: number) => `总共 ${total} 条`
            },
            hideToolbarDivider: true,
            hideRefreshButton: true,
            hideExportButton: true,
            hideAutoFitButton: true,
            hideAutoSizeButton: true,
            hideColumnSettingButton: true,
            hideFullScreenButton: true,
            idField: columnName,
            selection: false,
            columns: [
                {
                    title: 'Name',
                    field: columnName,
                    flex: 1,
                },
                {
                    title: 'Action',
                    key: 'action',
                    width: '50px',
                    render: (param: YvanUI.IGridCellRenderParam) => {
                        const {data} = param
                        return [
                            {
                                view: 'button',
                                icon: 'antd.PlusOutlined',
                                size: 'small',
                                onClick: () => {
                                    this.addTarget(columnName, data[columnName])
                                }
                            }
                        ]
                    }
                }
            ],
            dataSource: {
                func: (e) => {
                    return new Promise(resolve => {
                        YvanUI.ajax.func({
                            url: '/kg/search/match/info',
                            method: 'post-json',
                            data: {
                                label: columnName,
                                keyword: this.query[columnName],
                                offset: e.pagination.limitOffset,
                                limit: e.pagination.limit
                            }

                        }).then((res: any) => {
                            if (res.code !== 0) {
                                YvanUI.showError(res.result)
                                resolve({
                                    data: [],
                                    pagination: {
                                        currentPage: 1,
                                        total: 0,
                                        pageSize: e.pagination.limit
                                    },
                                    success: false,
                                })

                            } else {
                                resolve({
                                    data: _.map(res.result, r => {
                                        return {
                                            [columnName]: r
                                        }
                                    }),
                                    pagination: {
                                        currentPage: 1,
                                        total: res.total,
                                        pageSize: e.pagination.limit
                                    },
                                    success: true,
                                })
                            }
                        })
                    })
                },
                params: {
                    keyword: () => this.query[columnName]
                }
            },
        }, extend)
    }

    vjson = {
        view: 'page',
        title: '病症组合',
        items: [
            {
                view: 'row',
                gutter: [16, 16],
                items: [
                    {
                        view: 'col',
                        md: 8,
                        xs: 24,
                        items: [
                            {
                                view: 'card',
                                items: [
                                    this.buildTable('symptom', {
                                        ref: 'table1',
                                        toolbar: [
                                            {
                                                view: 'form',
                                                items: [
                                                    {
                                                        view: 'text',
                                                        label: '筛选',
                                                        bind: 'query.symptom',
                                                        onPressEnter: () => {
                                                            this.refs.table1.refresh()
                                                        }
                                                    }
                                                ]
                                            }
                                        ],
                                    })
                                ]
                            }
                        ]
                    },
                    {
                        view: 'col',
                        md: 8,
                        xs: 24,
                        items: [
                            {
                                view: 'card',
                                items: [
                                    {
                                        view: 'list',
                                        size: "small",
                                        header: <h1>症状</h1>,
                                        dataSource: () => this.main.targetKeys.symptom,
                                        renderItem: (item) => <List.Item
                                            actions={[<Button key="remove"
                                                              onClick={() => {
                                                                  const idx = _.indexOf(this.main.targetKeys.symptom, item)
                                                                  this.main.targetKeys.symptom.splice(idx, 1)
                                                              }}>删除</Button>]}
                                        >{item}</List.Item>
                                    },
                                    {
                                        view: 'list',
                                        size: "small",
                                        header: <h1>疾病</h1>,
                                        dataSource: () => this.main.targetKeys.disease,
                                        renderItem: (item) => <List.Item
                                            actions={[<Button key="remove"
                                                              onClick={() => {
                                                                  const idx = _.indexOf(this.main.targetKeys.disease, item)
                                                                  this.main.targetKeys.disease.splice(idx, 1)
                                                              }}>删除</Button>]}
                                        >{item}</List.Item>
                                    },
                                    {
                                        view: 'form',
                                        ref: 'theform',
                                        items: [
                                            {
                                                view: 'select',
                                                bind: 'main.gender',
                                                rules: [{required: true}],
                                                label: '性别',
                                                data: [
                                                    {value: '0', label: '男性'},
                                                    {value: '1', label: '女性'},
                                                    {value: '2', label: '不限'}
                                                ]
                                            },
                                            {
                                                view: 'select',
                                                bind: 'main.version',
                                                rules: [{required: true}],
                                                label: '版本',
                                                data: _.map(Data.versions, (n) => {
                                                    return {value: n, label: n}
                                                })
                                            },
                                            {
                                                view: 'button',
                                                text: '组合',
                                                type: 'primary',
                                                icon: 'fa fa-save',
                                                disabled: {
                                                    $watch: () => (this.main.targetKeys.symptom.length + this.main.targetKeys.disease.length) <= 1
                                                },
                                                onClick: () => this.refs.theform.validateFields()
                                                    .then(() =>
                                                        YvanUI.ajax.func({
                                                            url: '/kg/insert/node',
                                                            method: 'post-json',
                                                            data: {
                                                                "label": "group",
                                                                "params": {
                                                                    diseases: this.main.targetKeys.disease,
                                                                    symptoms: this.main.targetKeys.symptom,
                                                                    version: this.main.version,
                                                                    gender: this.main.gender
                                                                }
                                                            }

                                                        }).then((rest) => {
                                                            const res: any = rest
                                                            if (res.code != '0') {
                                                                YvanUI.showErrorDialog(res.result)
                                                            } else {
                                                                YvanUI.showSuccess('插入成功')
                                                                Object.assign(this.main, {
                                                                    guid: res.guid,
                                                                })

                                                                Object.assign(this.main.targetKeys, {
                                                                    symptom: [],
                                                                    disease: []
                                                                })
                                                            }
                                                        }))

                                                    .catch((e) => {
                                                        YvanUI.showValidateErrorDialog(this, e)
                                                    })
                                            },
                                            {
                                                view: 'button',
                                                text: '导入',
                                                type: 'primary',
                                                icon: 'fa fa-save',
                                                onClick: () => new Promise(resolve => {
                                                    YvanUI.ajax.func({
                                                        url: '/kg/insert/graph/node',
                                                        method: 'post-json',
                                                        data: {
                                                            "label": "group",
                                                            "guid": this.main.guid
                                                        }

                                                    }).then((rest) => {
                                                        const res: any = rest
                                                        if (res.code != '0') {
                                                            YvanUI.showErrorDialog(res.result)
                                                        } else {
                                                            YvanUI.showSuccess('插入成功')
                                                            Object.assign(this.main.targetKeys, {
                                                                symptom: [],
                                                                disease: []
                                                            });
                                                        }
                                                    }).finally(()=>{
                                                        resolve()
                                                    })
                                                })
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    },
                    {
                        view: 'col',
                        md: 8,
                        xs: 24,
                        items: [
                            {
                                view: 'card',
                                items: [
                                    this.buildTable('disease', {
                                        ref: 'table2',
                                        toolbar: [
                                            {
                                                view: 'form',
                                                items: [
                                                    {
                                                        view: 'text',
                                                        label: '筛选',
                                                        bind: 'query.disease',
                                                        onPressEnter: () => {
                                                            this.refs.table2.refresh()
                                                        }
                                                    }
                                                ]
                                            }
                                        ],
                                    })
                                ]
                            }
                        ]
                    }
                ]
            }
        ]
    }
}